<!DOCTYPE html>
  <html>
  <head>
      <meta charset="utf-8">
      <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
      <title>title</title>
      <link rel="stylesheet" type="text/css" href="../css/api.css"/>
      <link rel="stylesheet" type="text/css" href="../css/animate.css"/>
            <link rel="stylesheet" type="text/css" href="../css/scrollmenu.css"/>
      <script type="text/javascript" src="../script/api.js"></script>

      <style>
          body{
background-color: #ededed
          }

          @media all and (min-width: 640px) {
    body,html,.wenwen-footer,.speak_window{width:640px!important;margin:0 auto}
    .speak_window,.wenwen-footer{left:50%!important;margin-left:-320px}
}
input,button{outline:none;}
.wenwen-footer{width:100%;position:fixed;bottom:-5px;left:0;background:#f6f6f6; border-top:solid 1px #ddd;box-sizing:border-box;}
.wenwen_btn,.wenwen_help{width:15%;text-align:center;}
.wenwen_btn img,.wenwen_help img{height:40px;}
.wenwen_text{height:40px;border-radius:5px;border:solid 1px #636162;box-sizing:border-box;width:66%;text-align:center;overflow:hidden;margin-left:2%;}
.circle-button{padding:0 5px;}
.wenwen_text .circle-button{font-size:14px;color:#666;line-height:38px;}
.write_box{background:#fff;width:100%;height:40px;line-height:40px;display:none;}
.write_box input{height:40px;padding:0 5px;line-height:40px;width:100%;box-sizing:border-box;border:0;}
.wenwen_help button{width:95%;background:#42929d;color:#fff;border-radius:5px;border:0;height:40px;display:none;}
#wenwen{height:100%;}
.speak_window{overflow-y:scroll;height:100%;width:100%;position:fixed;top:0;left:0;}
.speak_box{margin-bottom:70px;padding:10px; padding-top: 30px}
.question,.answer{margin-bottom:1rem;}
.question{text-align:right;}
.question>div{display:inline-block;}
.left{float:left;}
.right{float:right;}
.clear{clear:both;}
.heard_img{height:38px;width:38px;border-radius:5px;overflow:hidden;background:#ddd;}
.heard_img img{width:100%;height:100%}
.question_text,.answer_text{box-sizing:border-box;position:relative;display:table-cell;min-height:60px;}
.question_text{padding-right:15px;}
.answer_text{padding-left:15px;}
.question_text p,.answer_text p{border-radius:3px;padding-top:  6px; padding-left:7px;padding-right:  7px;padding-bottom:  6px;margin:0;font-size:16px;line-height:25px;box-sizing:border-box;vertical-align:middle;display:table-cell;
max-width:243px;word-wrap:break-word;
}
.answer_text p{background:#fff;}
.question_text p{background:#a9e97a;color:#000;text-align:left;}
.question_text i,.answer_text i{width:0;height:0;border-top:5px solid transparent;border-bottom:5px solid transparent;position:absolute;top:13px;}
.answer_text i{border-right:5px solid #fff;left:10px;}
.question_text i{border-left:5px solid #a9e97a;right:10px;}
.answer_text p a{color:#42929d;display:inline-block;}

.answer_text p img{width: 150px;}
.question_text p img{width: 150px;}


.del-footer{width:100%;position:fixed;
  bottom:-5px;left:0;background:#fff; border-top:solid 1px #ddd;
  box-sizing:border-box;line-height: 45px;height: 45px;text-align: center;display: none;
}
.del-footer span{width: 24%}
.del-footer span .del_img{line-height: 45px;width: 50%}

.chang-image-footer{
  width:100%;position:fixed;
  bottom:-5px;left:0;background:#ece9e9; border-top:solid 1px #ddd;
  box-sizing:border-box;line-height: 47%;height: 47%;
  border-radius: 10px;display: none;z-index: 102;
}
.chang-image-footer div{width: 100%;}
.chang-image-footer span{width: 20%;font-size: 12px;color: #ccc;text-align: center;height: 50px}
/*.chang-image-footer span img{height: 50px;margin-bottom: 10px;}*/
.chang-image-footer span .ch_img{line-height: 60px;height: 60;top:10px;margin: 10px;}
.chang-image-footer span p{line-height: 20px;height: 20;}

.chang-image-footer .img-5{
  height: 30px; line-height: initial;
}
.chang-image-footer .img-5 span{display: inline-block;height: 30px; }
.chang-image-footer .img-1{width: 100%;margin-top: 10px;}
.chang-image-footer .img-1 span{height: 55px;line-height: 55px;
 font-size: 16px;font-weight: 900;width: 96%;text-align: center;margin: 0 2%;
 border-radius: 5px;padding: 15px auto;background-color: #fff;}
.chang-image-footer .img-1 span img{float: left;line-height: 55px;height: 25px; margin:15px 10px;}
.chang-image-footer .img-1 span b{float: left;color: #000;line-height: 55px;}
.chang-image-footer .img-1 span i{float: right;margin-right: 20px;}

.chang-image-footer .img-butt{width: 100%;line-height: 50px;text-align: center;}

.img-butt{width: 25px;background-color: #fff;margin-top: 10px;}
.question .duoxuan{
  position: absolute;
  width: 60%;
  float: right;
  margin-top: -130px;
  right: 30px;
  margin-bottom: 10px;
  padding: 10px;
  background-color: rgb(14 14 14 / 70%);
  color: #fff;
  display: none;

}
.question .duoxuan span{
  text-align: center;
  width: 19%;
  float: left;
  padding: 3px;
  font-size: 10px;
/*white-space: nowrap;*/
}
.question .duoxuan span p{
white-space: nowrap;


}

.question .duoxuan i{


    border-bottom: 5px solid #111;
    top: 150px;
}
.question .duoxuan span .duo_img{
  width: 80%;
  margin: 0 0 5px 0;
  padding: 0 2px;
}


audio{display:none;}
.saying{position:fixed;bottom:30%;left:50%;width:120px;margin-left:-60px;display:none;}
.saying img{width:100%;}
.write_list{position:absolute;left:0;width:100%;background:#fff;border-top:solid 1px #ddd;padding:5px;line-height:30px;}

.gzhimg{padding-top: 15px; padding-bottom: 15px;}
.sr{ padding-top: 10px;  background-color: #f6f6f6}
.input{background: #fff;   height: 35px; border-radius:5px; line-height: 35px}
.rightbnt{padding-top: 3px; margin-left: 10px}

.fl{float: left;}
.fs{ }
.fs button{background: #07c160; width: 50px; height: 30px; color: #fff; position: absolute;border-radius:3px; font-size: 13px; top: 13px;right: -110px}
.fr{float: right;}
.time{ line-height: 30px; text-align: center; font-size: 11px;color: #a0a0a0}
.bgw{background-color: #ededed}
#chang_img{width: 100%;height: 100%; display: none;}
#chang_img img{width: 100%;height: 100%;position:fixed;z-index: 100;}

#chang_alert{
  width: 100%;height: 100%;
  background-color: rgba(14 14 14 / 50%);
  position: absolute;top: 0;bottom: 0;
  z-index: 101;
  display: none;
}


#chang_alert .alert_d{
  margin: 0 auto;width: 70%;
  line-height: 100%; height: 120px;
  background-color: #fff;
  margin-top:60%;
  border-radius: 10px;
}
#chang_alert .alert_d .alert_que{
  height: 90px;
  line-height: 90px;
    text-align: center;

}
#chang_alert .alert_d .alert_btn{
  height: 30px;
  line-height: 30px;
  text-align: center;
}
#chang_alert .alert_d .alert_btn button{
    height: 30px;
  line-height: 30px;
  width: 50%;
  display: block;
}
#chang_alert .alert_d .alert_btn .right{
  color: #FF0000;
}
.chang_load{
  position: absolute;
  margin-top: 45%;
  margin-left: 45%;
  width: 100px;
  height: 100px;
  background-color: rgba(14 14 14 / 50%);z-index: 103;
  border-radius: 10px;
  display: none;
}

.loader-03 {
  color: #ccc;
    border: .2em solid currentcolor;
    border-bottom-color: transparent;
    border-radius: 50%;
    -webkit-animation: 1s loader-03 linear infinite;
    animation: 1s loader-03 linear infinite;
    position: relative;margin-top: 45px;
}
@-webkit-keyframes loader-03 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@keyframes loader-03 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}


      </style>
  </head>
  <body style="background-color: #ededed">
    <div id="wrap">
      <div id="chang_img"><img src="../image/top.png"/></div> 
      <div id="chang_alert">
        <div class="alert_d">
          <div class="alert_que">确认删除？</div>
          <div class="alert_btn">
            <button class="left alert_qu">取消</button>
            <button class="right alert_del">删除</button>

          </div>
        </div>
      </div> 
    <div class="chang_load">
      <div class="loader-03"></div>
    </div>
<div class="time" id="time"></div>

      <div class="speak_window"  >
      	<div class="speak_box">
       

        <div class="answer">
          <div class="heard_img left"><img id="mytx"  src="../image/yehua.jpg"></div>
          <div class="answer_text"><p>长按消息，唤醒消息操作菜单</p><i></i>
          </div>
        </div>
        <div class="answer">
          <div class="heard_img left"><img id="mytx"  src="../image/header01.png"></div>
          <div class="answer_text"><p>点击空白处，操作菜单消失</p><i></i>
          </div>
        </div>
        <div class="answer">
          <div class="heard_img left"><img id="mytx"  src="../image/header01.png"></div>
          <div class="answer_text"><p>点击空白处，操作菜单消失</p><i></i>
          </div>
        </div>
        <div class="answer">
          <div class="heard_img left"><img id="mytx"  src="../image/header01.png"></div>
          <div class="answer_text"><p>点击空白处，操作菜单消失</p><i></i>
          </div>
        </div>

        <div class="question">
          <div class="duoxuan">
            <span ><img class="duo_img" src="../image/header01.png"><p>转发</p></span>
            <span ><img class="duo_img" src="../image/header01.png"><p>收藏</p></span>
            <span ><img class="duo_img" src="../image/header01.png"><p>编辑</p></span>
            <span ><img class="duo_img" src="../image/header01.png"><p>删除</p></span>
            <span class="duoxian_5"><img class="duo_img" src="../image/header01.png"><p>多选</p></span>
            <span ><img class="duo_img" src="../image/header01.png"><p>引用</p></span>
            <span ><img class="duo_img" src="../image/header01.png"><p>提醒</p></span>
            <span ><img class="duo_img" src="../image/header01.png"><p>收一收</p></span>
            <i></i>
          </div>
          <div class="heard_img left chang_d"  id="duoxuan"  style="width: 20px;height: 20px;border-radius: 10px;display: none;"><img class="kong" src="../image/kong1.png"/><img class="dagou" src="../image/dagou.png"/></div>
          <div class="heard_img right"><img id="mytx" src="../image/4.jpg"></div>
          <div class="question_text clear" id="question_text"><p><img src="../image/4.jpg"></p><i></i>
          </div>
        </div>

        <div class="question">
          <div class="duoxuan">
            <span ><img class="duo_img" src="../image/icon/1.png"><p>转发</p></span>
            <span ><img class="duo_img" src="../image/icon/2.png"><p>收藏</p></span>
            <span ><img class="duo_img" src="../image/icon/3.png"><p>编辑</p></span>
            <span ><img class="duo_img" src="../image/icon/4.png"><p>删除</p></span>
            <span class="duoxian_5"><img class="duo_img" src="../image/icon/5.png"><p>多选</p></span>
            <span ><img class="duo_img" src="../image/icon/6.png"><p>引用</p></span>
            <span ><img class="duo_img" src="../image/icon/8.png"><p>提醒</p></span>
            <span ><img class="duo_img" src="../image/icon/9.png"><p>收一收</p></span>
            <i></i>
          </div>
          <div class="heard_img left chang_d"  id="duoxuan"  style="width: 20px;height: 20px;border-radius: 10px;display: none;"><img class="kong" src="../image/kong1.png"/><img class="dagou" src="../image/dagou.png"/></div>
          <div class="heard_img right"><img id="mytx" src="../image/4.jpg"></div>
          <div class="question_text clear" id="question_text"><p>你好吗，还在看吗<i></i>
          </div>
        </div>


        </div>
      </div>
      <div class="del-footer" >
            <span ><img class="del_img" src="../image/shangchuan.png"></span>
            <span ><img class="del_img" src="../image/shoucang.png"></span>
            <span class="del_duo"><img class="del_img" src="../image/del.png"></span>
            <span ><img class="del_img" src="../image/email.png"></span>
      </div>

      <div class="chang-image-footer" >
        <div class="img-3">
          <span ><img class="ch_img" src="../image/fasong.png"><p>发送给朋友</p></span>
          <span ><img class="ch_img" src="../image/souc.png"><p>收藏</p></span>
          <span ><img class="ch_img" src="../image/sousou.png"><p>搜一搜</p></span>
        </div>
        <div class="img-4">
          <span ><img class="ch_img" src="../image/xiazai.png"></span>
          <span ><img class="ch_img" src="../image/banj.png"></span>
          <span ><img class="ch_img" src="../image/liaot.png"></span>
          <span ><img class="ch_img" src="../image/shib.png"></span>
        </div>
        <div class="img-5">
          <span >保存图片</span>
          <span >编辑</span>
          <span  style="vertical-align: top;">定位到聊天<br />位置</span>
          <span >提取文字</span>
        </div>
        <div class="img-1">
          <span class="shibe"><img class="ch_img" src="../image/pcode.png"><b>识别图中二维码</b><i class="">></i></span>
        </div>
        <div class="img-butt"><button>取消</button></div>
      </div>


      <div class="wenwen-footer" style="display:none" >

        <div class="sr" id="footer">
    <div class="leftbnt fl"><img src="../image/gzhbnt1.png" height="40px" > </div>
    <div class="input fl" id="ip"><input type="txt" id="srk" ></div>

    <div class="rightbnt fl" id="rightbnt"><img src="../image/gzhrightbnt1.png" height="28px" ></div>
      <div class="rightbnt fl" id="rightbnt2"><img src="../image/gzhrightbnt2.png" height="28px" ></div>
    <div class="fs">  <button onclick="up_say()" id="fs" class="right">发送</button></div>
        </div>
        <div style="display:none">

      	<div class="wenwen_btn left" onclick="to_write()"><img src="./jQuery仿手机微信聊天界面代码_files/jp_btn.png"></div>
      	<div class="wenwen_text left">
      	    <div class="write_box">
      	        <input type="text" class="left" onkeyup="keyup()" placeholder="请输入关键字">
      	    </div>
      	    <div class="circle-button" id="wenwen">
      	        按住 说话
      	    </div>
      	</div>
      	<div class="wenwen_help right">

      	    <button onclick="up_say()" class="right">发送</button>
      	</div>
      	<div style="opacity:0;" class="clear"></div>
      </div>




    </div>

  </body>
  <script type="text/javascript" src="../script/api.js"></script>
  <script type="text/javascript" src="../script/common.js"></script>
  <script  type="text/javascript"  src="../script/jquery-2.1.1.min.js"></script>
  <script type="text/javascript" src="../script/jquery.mobile-1.4.5.min.js"></script>
  <script type="text/javascript" src="../script/bscroll.js"></script>
  <script type="text/javascript" src="../script/scrollmenu3.js"></script>
        <script type="text/javascript" src="../script/jquery.js"></script>

<script type="text/javascript">
    // $(document).on("click",'#question_text img',function(){

    $(document).ready(function () {

      $.ajax({
        url:"http://103.229.183.126",
         
        success:function(result){
          console.log(result)
        // $("#div1").html(result);
    }});
  })





  $(document).on("click",'.img-butt',function(){
    $('.chang-image-footer').hide();
        $('#chang_img').hide();
  });

  $(document).on("click",'.shibe',function(){
    $('.chang_load').show();

  setTimeout(cha_hide, 200);
    // setTimout(function(){
    //   $('.chang_load').hide();
    //     $('#chang_img').hide();
    //     $('.chang-image-footer').hide();
    //   //

    // },200);
    $('.chang-image-footer').hide();
    $('#chang_img').hide();
  });

  function cha_hide(){
    $('.chang_load').hide()

     api.openWin({
        name: 'pcode',
        url: './pcode.html',
      });
  }


$("#question_text img").mousedown(function() { 
  var img = $(this).attr('src');
  $('#chang_img').show();
  $("#chang_img img").attr('src',img);
});
$("#chang_img img").mousedown(function() {
  
      // api.addEventListener({
    //   name:'longpress'
    // }, function(ret, err){ 
    //   // $(this)..find('.duoxuan').show();       
    //   alert('长按了页面');
    // });
    // $('#chang_img').hide();

    $('.chang-image-footer').show();

 });




  $(document).on("mousedown",'#question_text',function(){

    $(this).siblings('.duoxuan').toggle();
      $(this).siblings('.duoxuan').addClass('duo_show');
    // api.addEventListener({
    //   name:'longpress'
    // }, function(ret, err){ 
    //   // $(this)..find('.duoxuan').show();       
    //   alert('长按了页面');
    // });
}); 

  $(document).on("click",'.duoxian_5',function(){
    $('.question #duoxuan').toggle();
    $('.duo_show').hide();
        $(document).removeClass('duo_show');

       $('.del-footer').toggle();
    // $(this).parent().siblings('#duoxuan').toggle();
  })

  $(document).on("click",'.del_duo',function(){
      $('#chang_alert').show();

    });
  $(document).on("click",'.alert_qu',function(){
      $('#chang_alert').hide();
      // $('.del-footer').hide();
      $('.question #duoxuan').hide();
    });
  $(document).on("click",'.alert_del',function(){
      $('#chang_alert').hide();
      // $('.del-footer').hide();
      $('.question #duoxuan').hide();
    });

  

  $(document).click(function (e) {
    var $target = $(e.target);
    // 选择框class="Modal"
    //选择按钮class="btn"
    if (!$target.is('.duo_show *') && !$target.is('#question_text *')) {
        $('.duo_show').hide();
        $(document).removeClass('duo_show');
    }

    // if (!$target.is('#duoxuan *')) {
    //     $('#duoxuan').hide();
    // }
});
  var ns = 0;
  $(document).on("click",'#duoxuan .dagou',function(){
    ns--;
    if(ns<1){
     $('.del-footer').hide();
    }
    $(this).hide();
    $(this).siblings('.kong').show();
    
     console.log(ns);
  });
  $(document).on("click",'#duoxuan .kong',function(){
    ns++;

    $('.del-footer').show();
    $(this).hide();
    $(this).siblings('.dagou').show();
  });

  </script>
  <script type="text/javascript">
  // function duoxuan(){
  //   $('#duoxuan').show();
  // }
  // $(document).on("click",'#duoxuan img',function(){

  //   $('#duoxuan .dagou').hide();
  //   // $('#duoxuan img').attr('src','../image/dagou.png');
  // })

  var w ;
  var w2 ;
  var tt=0;
  var fs=0;
  var sj;
var hf1,hf2,hf3;
  function sj( ){

    var day2 = new Date();
     day1 = new Date(day2.valueOf() );// 当前时间减掉1分钟
  day1.setTime(day1.getTime());
  if(day1.getMinutes()<10){
  minutes="0"+day1.getMinutes()
  }
  else {
   minutes= day1.getMinutes()
  }
  i=day1.getHours()
  //s2 = day2.getHours()+":" +minutes;

  if(i>=0 && i<6){
      s2= "凌晨"+i+":"+minutes;
  } else if(i>=6 && i<=12 ){
      s2= "上午"+i+":"+minutes;

    }else if(i>12 && i <=18){
      i=i-12;
       s2= "下午"+i+":"+minutes;
    }else if(i>18 && i<=23){
      i=i-12;
         s2= "晚上"+i+":"+minutes;
    }
    else  {
    s2= i+":"+minutes;

  }
      $api.html($api.byId('time'), s2);
  sj=s2 ;
  }

  	function to_write(){
  	    $('.wenwen_btn img').attr('src','images/yy_btn.png');
  	    $('.wenwen_btn').attr('onclick','to_say()');
  	    $('.write_box,.wenwen_help button').show();
  	    $('.circle-button,.wenwen_help a').hide();
  	    $('.write_box input').focus();
  	    for_bottom();
  	}

    function fasong(){

            // $api.css($api.byId('ip'),'width:'+(w-60)+'px;');
    }

    $("#srk").on('input',function(){
                    if(!($('#srk').val()=='')){
    $("#fs").animate({right:'10px'},'slow');
  //$("#rightbnt2").hide();
      $("#ip").animate({width: (w-13)+'px'},'slow');
      //  $api.css($api.byId('ip'),'width:'+(w-35)+'px;');
                    }else{
  $("#fs").animate({right:'-110px'},'fast');
  $("#ip").animate({width:w2+'px'},'slow');
      //  $("#rightbnt2").show();
        }
                })


  	function to_say(){
  		$('.write_list').remove();
  	    $('.wenwen_btn img').attr('src','images/jp_btn.png');
  	    $('.wenwen_btn').attr('onclick','to_write()');
  	    $('.write_box,.wenwen_help button').hide();
  	    $('.circle-button,.wenwen_help a').show();
  	}

  	function up_say(t){
fs++;
if(tt==0){
  sj( );
  tt=1;
}



  		$('.write_list').remove();
  	     var text = t,
  	        str  = '<div class="question">';

            str += '<div class="duoxuan">';
            str += '<span ><img class="duo_img" src="../image/icon/1.png"><p>转发</p></span>';
            str += '<span ><img class="duo_img" src="../image/icon/2.png"><p>收藏</p></span>';
            str += '<span ><img class="duo_img" src="../image/icon/3.png"><p>编辑</p></span>';
            str += '<span ><img class="duo_img" src="../image/icon/4.png"><p>删除</p></span>';
            str += '<span class="duoxian_5"><img class="duo_img" src="../image/icon/5.png"><p>多选</p></span>';
            str += '<span ><img class="duo_img" src="../image/icon/6.png"><p>引用</p></span>';
            str += '<span ><img class="duo_img" src="../image/icon/8.png"><p>提醒</p></span>';
            str += '<span ><img class="duo_img" src="../image/icon/9.png"><p>收一收</p></span>';
            str += '<i></i>';
            str += '</div>';


  	        str += '<div class="heard_img right"><img id="mytx"   src="'+mytx+'"></div>';
  	        str += '<div class="question_text clear"><p>'+text+'</p><i></i>';
  	        str += '</div></div>';

  	    if(text == ''){

  	        $('.write_box input').focus();
  	    }else{


if(fs==1){
  zdhf=hf1;
}else if(fs==2){
  zdhf=hf2;
}else if(fs==3){
  zdhf=hf3;
}else {
  zdhf=""
}



  	        $('.speak_box').append(str);
  	        $('#srk').val('');
  	       $('#srk').focus();
           $("#fs").animate({right:'-110px'},'fast');
           $("#ip").animate({width:w2+'px'},'slow');
  	        autoWidth();
            if(zdhf==""){
              return
            }
  //  localStorage.setItem('chatzdhf',zdhf);
  html='<div class="frame" > <div class="fl" id="fl"> <div class="tx"><img src="'+gzhtx+'"   height="60px" ></div><div class="mc">'+api.pageParam.wxm+'<br><span class="nr list_img" id="nr">'+zdhf+' </span>  </div><div class="sj" id="sj"> '+sj+'</div></div></div>'
//console.log(html)

var jsfun = " chathtml('"+html+"')" ;
api.execScript({
    name: 'root',
    frameName: 'frame0',
    script: jsfun
});

  	        for_bottom();

  	        setTimeout(function(){
  	            var ans  = '<div class="answer"><div class="heard_img left"><img src="'+gzhtx+'"></div>';
  	            	ans += '<div class="answer_text"><p>'+zdhf+'</p><i></i>';
  	        		ans += '</div></div>';
  	        	$('.speak_box').append(ans);
  				for_bottom();
  	        },1000);
  	    }
  	}



    function dingwei(t){
fs++;
if(tt==0){
  sj( );
  tt=1;
}



  		$('.write_list').remove();
  	     var text = t,
  	        str  = '<div class="question">';
             str += '<div class="duoxuan">';
            str += '<span ><img class="duo_img" src="../image/icon/1.png"><p>转发</p></span>';
            str += '<span ><img class="duo_img" src="../image/icon/2.png"><p>收藏</p></span>';
            str += '<span ><img class="duo_img" src="../image/icon/3.png"><p>编辑</p></span>';
            str += '<span ><img class="duo_img" src="../image/icon/4.png"><p>删除</p></span>';
            str += '<span class="duoxian_5"><img class="duo_img" src="../image/icon/5.png"><p>多选</p></span>';
            str += '<span ><img class="duo_img" src="../image/icon/6.png"><p>引用</p></span>';
            str += '<span ><img class="duo_img" src="../image/icon/8.png"><p>提醒</p></span>';
            str += '<span ><img class="duo_img" src="../image/icon/9.png"><p>收一收</p></span>';
            str += '<i></i>';
            str += '</div>';
  	        str += '<div class="heard_img right"><img id="mytx"   src="'+mytx+'"></div>';
  	        str += '<div class="question_text  clear  "><p style="background: #fff; padding:0px;line-height:0px"> <img width=230 src="'+text+'" ></p><i style="border-left: 5px solid #fff;"></i>';
  	        str += '</div></div>';

  	    if(text == ''){

  	        $('.write_box input').focus();
  	    }else{


if(fs==1){
  zdhf=hf1;
}else if(fs==2){
  zdhf=hf2;
}else if(fs==3){
  zdhf=hf3;
}else {
  zdhf=""
}



  	        $('.speak_box').append(str);
  	        $('#srk').val('');
  	       $('#srk').focus();
           $("#fs").animate({right:'-110px'},'fast');
           $("#ip").animate({width:w2+'px'},'slow');
  	        autoWidth();




  	    }
  	}


  	function keyup(){
  		var footer_height = $('.wenwen-footer').outerHeight(),
  			text = $('.write_box input').val(),
  			str = '<div class="write_list">'+text+'</div>';
  		if (text == '' || text == undefined){
  			$('.write_list').remove();
  		}else{
  			$('.wenwen-footer').append(str);
  			$('.write_list').css('bottom',footer_height);
  		}
  	}

  	var wen  = document.getElementById('wenwen');
  	function _touch_start(event){
          event.preventDefault();
          $('.wenwen_text').css('background','#c1c1c1');
          $('.wenwen_text span').css('color','#fff');
          $('.saying').show();
      }

      function _touch_end(event){
          event.preventDefault();
          $('.wenwen_text').css('background','#fff');
          $('.wenwen_text .circle-button').css('color','#666');
          $('.saying').hide();
          var str  = '<div class="question">';
             str += '<div class="duoxuan">';
            str += '<span ><img class="duo_img" src="../image/icon/1.png"><p>转发</p></span>';
            str += '<span ><img class="duo_img" src="../image/icon/2.png"><p>收藏</p></span>';
            str += '<span ><img class="duo_img" src="../image/icon/3.png"><p>编辑</p></span>';
            str += '<span ><img class="duo_img" src="../image/icon/4.png"><p>删除</p></span>';
            str += '<span class="duoxian_5"><img class="duo_img" src="../image/icon/5.png"><p>多选</p></span>';
            str += '<span ><img class="duo_img" src="../image/icon/6.png"><p>引用</p></span>';
            str += '<span ><img class="duo_img" src="../image/icon/8.png"><p>提醒</p></span>';
            str += '<span ><img class="duo_img" src="../image/icon/9.png"><p>收一收</p></span>';
            str += '<i></i>';
            str += '</div>';
  	        str += '<div class="heard_img right">'+gzhtx+'</div>';
  	        str += '<div class="question_text clear"><p>不好意思，我听不清！</p><i></i>';
  	        str += '</div></div>';
  		$('.speak_box').append(str);
  		for_bottom();
          setTimeout(function(){
          	var ans  = '<div class="answer"><div class="heard_img left"><img src="images/dglvyou.jpg"></div>';
  	        	ans += '<div class="answer_text"><p>我不知道你在说什么?</p><i></i>';
  	    		ans += '</div></div>';
  	    	$('.speak_box').append(ans);
  			for_bottom();
          },1000);
      }

      wen.addEventListener("touchstart", _touch_start, false);
      wen.addEventListener("touchend", _touch_end, false);

      function for_bottom(){
  		var speak_height = $('.speak_box').height();
  		$('.speak_box,.speak_window').animate({scrollTop:speak_height},500);
  	}

  	function autoWidth(){
  		$('.question_text').css('max-width',$('.question').width()-60);
  	}

    function wzxz(){
      $("body").scrollmenu({
        type:'cross',
        hasLineBorder:false,
        // bscroll:true,
        // animateIn:'bounceIn',
        // animateOut:'bounceOut',

        click:function(ret){
          if( ret.index==0 ){
            var jsfun = 'hide();';
    api.execScript({
        script: jsfun
    });
            api.openWin({
               name: 'dt',
                  url: './dtFrame.html',

             });

         }

       }

        }
    );
    }
  	autoWidth();

  </script>
  
  <script type="text/javascript">


  var gzhtx,zdhf,mytx;
      apiready = function(){
        var winHeight = api.winHeight;
               h=winHeight-50-api.safeArea.top- api.safeArea.bottom
               $api.css($api.byId('wrap'),'min-height:'+h+'px;');

      w = api.winWidth-190;
            w2 = api.winWidth-190;
               var footer = $api.byId('footer');
                 footer.style.paddingBottom = api.safeArea.bottom +"px" ;
            $api.css($api.byId('ip'),'width:'+w+'px;');


            api.ajax({
            url:localStorage.getItem('domain')+"/index.php/Home/Index/getlxr.html?id=" +api.pageParam.id,
            method: 'get',

          },function(ret,err){

          console.log( JSON.stringify( ret   ) );
          
          if(ret.user==null){
            gzhtx= '';
            // gzhtx= localStorage.getItem('domain')+ret.web_logo.shou_account   ;
          }else{
            gzhtx= localStorage.getItem('domain')+ret.user.thumb   ;
          }

        //  localStorage.setItem('chatgzhtx',gzhtx);
        mytx='';

// mytx=localStorage.getItem('domain')+ret.web_logo.shou_account;
hf1=ret.hf1;
hf2=ret.hf2;
hf3=ret.hf3;
//zdhf=ret.task_list.taskuser;
      //        $api.html($api.byId('gzhf'),  ret.task_list.info );
        //        $api.attr($api.byId('gzhtx'),'srcs' ,  ret.task_list.tushi[0] );
  //  $api.html($api.byId('time'), ret.task_list.sj);

                _zyzImgCache();
          })




      };
    //  dingwei("http://103.123.160.73/Upload/Advert/thumb/5eb25ec9434b5.png")
  </script>
  </html>
